<template>
  <div id="app">
    <router-view />
  </div>
</template>
<script setup>
import { onBeforeMount, onMounted, onBeforeUnmount } from 'vue'
import { useStore } from 'vuex'
import { resetSize } from '@ruifox-cms/utils/src/tools'
import { myDebounce } from './utils/tools'

const store = useStore()
onBeforeMount(async () => {
  await store.dispatch('user/login')
  await store.dispatch('setting/getInfo')
  const { iconInit } = await import('@ruifox-cms/utils')
  const res = await store.dispatch('base/getGroupSetting')
  iconInit(res.publicIcon)
})


//页面响应式
const handleResize = myDebounce(resetSize, 200)
onMounted(() => {
  resetSize()
  window.addEventListener('resize', handleResize); // 监听窗口变化
})
onBeforeUnmount(() => {
  window.removeEventListener('resize', handleResize); // 清除监听
});
</script>

<style lang="scss">
#app{
  width: 100vw;
  height: 100vh;
  overflow-y: hidden;
}
.el-dialog{
  max-width: calc(100% - 20px);
}
</style>